<!doctype html>
<html lang="zxx" xmlns:th="http://www.thymeleaf.org">
<head>
    <div th:include="comment :: commonheader"></div>
    <!-- Title -->
    <title>编程蛙--少儿编程</title>
</head>

<body>


<div th:replace="comment :: commondiv1"></div>


<!-- Start Page Title Area -->
<div class="page-title-area bg-19">
    <div class="container">
        <div class="page-title-content">
            <h2>课时包购买</h2>
            <ul>
                <li>
<!--                    <a href="index.html">-->
<!--                        首页-->
<!--                    </a>-->
                </li>

                <li class="active">Shop</li>
            </ul>
        </div>
    </div>
</div>
<!-- End Page Title Area -->

<!-- Start Shop Area -->
<div class="shop-area ptb-100">
    <div class="container">
        <div class="row">
            <div class="col-lg-8">
                <div class="shop-card-wrap">
                    <div class="showing-result">
                        <div class="row align-items-center">
                            <div class="col-lg-6 col-sm-6">
                                <div class="showing-result-count">
                                </div>
                            </div>

                        </div>
                    </div>

                    <div class="row">


                        <div class="col-lg-4 col-sm-6"  th:each="product:${products}">
                            <div class="single-shop">
                                <div class="shop-img">
                                    <a th:href="@{'/shop/' + ${product.proid}}">
                                        <img th:src="@{'assets/img/shop/' + ${product.prourl}}">
                                    </a>
                                </div>

                                <h3 th:text="${product.proname}"></h3>
                                <span th:text="${product.proprice}"></span>

                                <a th:href="@{'/shop/' + ${product.proid}}" class="default-btn" onclick="buyfun()">
                                    购买
                                </a>
                            </div>
                        </div>



                    </div>
                </div>
            </div>


        </div>
    </div>
</div>
<!-- End Shop Area -->

<!-- Start Product View One Area -->
<div class="modal fade product-view-one" id="product-view-one">
    <div class="modal-dialog">
        <div class="modal-content">
            <button type="button" class="close" data-dismiss="modal">
                        <span aria-hidden="true">
							<i class="bx bx-x"></i>
						</span>
            </button>

            <div class="row align-items-center">
                <div class="col-lg-6 col-md-6">
                    <div class="product-view-one-image">
                        <div id="big" class="owl-carousel owl-theme">
                            <div class="item">
                                <img src="assets/img/shop/shop-img-1.jpg" alt="Image">
                            </div>
                            <div class="item">
                                <img src="assets/img/shop/shop-img-2.jpg" alt="Image">
                            </div>
                            <div class="item">
                                <img src="assets/img/shop/shop-img-3.jpg" alt="Image">
                            </div>
                            <div class="item">
                                <img src="assets/img/shop/shop-img-4.jpg" alt="Image">
                            </div>
                            <div class="item">
                                <img src="assets/img/shop/shop-img-5.jpg" alt="Image">
                            </div>
                            <div class="item">
                                <img src="assets/img/shop/shop-img-6.jpg" alt="Image">
                            </div>
                        </div>

                        <div id="thumbs" class="owl-carousel owl-theme">
                            <div class="item">
                                <img src="assets/img/shop/shop-img-1.jpg" alt="Image">
                            </div>
                            <div class="item">
                                <img src="assets/img/shop/shop-img-2.jpg" alt="Image">
                            </div>
                            <div class="item">
                                <img src="assets/img/shop/shop-img-3.jpg" alt="Image">
                            </div>
                            <div class="item">
                                <img src="assets/img/shop/shop-img-4.jpg" alt="Image">
                            </div>
                            <div class="item">
                                <img src="assets/img/shop/shop-img-5.jpg" alt="Image">
                            </div>
                            <div class="item">
                                <img src="assets/img/shop/shop-img-6.jpg" alt="Image">
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-lg-6 col-md-6">
                    <div class="product-content">
                        <h3>
                            <a href="#">少儿编程36课时</a>
                        </h3>

                        <div class="price">
<!--                            <del>$59.00</del> -->
<!--                            <span class="new-price">$39.00</span>-->
                        </div>

                        <div class="product-review">
                            <div class="rating">
                                <i class="bx bxs-star"></i>
                                <i class="bx bxs-star"></i>
                                <i class="bx bxs-star"></i>
                                <i class="bx bxs-star"></i>
                                <i class="bx bxs-star"></i>
                            </div>
<!--                            <a href="#" class="rating-count">3 reviews</a>-->
                        </div>

                    </div>
                </div>

            </div>
        </div>
    </div>
</div>
<!-- End Product View One Area -->


<div th:include="comment :: commonscript"></div>
<script th:src="@{assets/js/showpassword.js}"></script>
<script>
    function buyfun() {
        let judge=window.confirm("请确认购买");
    }
</script>
</body>
</html>